import React from 'react'
import {
  View, Text, Image, Button
} from '@tarojs/components'
import Navigate from '@NAVIGATION/navigateManager'
import Images from '@ASSET/Images'
import i18n from '@I18N'
import withWebLogin from '@HOC/withWebLogin'
import { getPlatform, convertPx } from '@UTILS/common'
import useGetWindowHeight from '@HOOKS/useGetWindowHeight'
import './index.scss'

const { isWeb } = getPlatform()

function Login({ showLogin, headerHeight = 0 }) {
  const style = { height: convertPx(useGetWindowHeight() - headerHeight) }
  return (
    <View style={style} className="login-prev-container">
      <Image src={Images.login.before_login} className="login-prev-bg-icon" />
      <Text className="login-prev-tip">{i18n.login.login_to_see_more()}</Text>
      <Button className="login-prev-button" onClick={isWeb ? showLogin : Navigate.authPage}>
        {i18n.login.login_button()}
      </Button>
    </View>
  )
}

export default withWebLogin(Login)
